<template>
  <!-- 每日金句 -->
  <div class="DailySentenceView" :style="{ background: backgrounColor }">
    <!-- 返回栏 -->
    <van-nav-bar title="每日金句" left-arrow @click-left="Goreturn">
      <template #right>
        <van-icon color="black" name="share-o" size="18" />
      </template>
    </van-nav-bar>
    <daily-sentence-item
      :DailySentenceList="DailySentenceList"
    ></daily-sentence-item>
  </div>
</template>

<script>
import { DailySentence } from "@/api/request";
import DailySentenceItem from "@/components/DailySentenceView/DailySentenceItem.vue";
export default {
  components: { DailySentenceItem },
  name: "DailySentenceView",
  data() {
    return {
      DailySentenceList: [],
      backgrounColor: "#796f6a",
    };
  },
  mounted() {
    DailySentence({
      page: 1,
    }).then(({ data }) => {
      this.DailySentenceList = data.data.data;
      console.log(this.DailySentenceList);
    });

    this.$bus.$on("bgcColor", (data) => {
      console.log("主要页面", data);
      this.backgrounColor = data;
    });
  },
  methods: {
    // 返回
    Goreturn() {
      this.$router.go(-1);
    },
  },
};
</script>

<style lang="scss" scope>
.DailySentenceView {
  height: 100vh;
  //   padding: 0.625rem 0.875rem;

  //   返回栏
  .van-nav-bar {
    .van-nav-bar__left {
      .van-icon {
        color: black;
      }
    }
  }
}
</style>